<template>
  <div class="w-100" style="height: 90%">
    <CustomTableVue
      :showLabel="false"
      :field-list="fieldList"
      :table-data="tableData"
    >

      <template #czzt="slotProps">
    <span :class="textColorClass(slotProps.row.czsj)">{{ slotProps.row.czsj?'已处置':'未处置' }}</span>

      </template>
      <template #action>
        <div class="text-center">
          <img width="18" src="@/assets/image/svg/location2.png" class="icon" />
        </div>
      </template>
    </CustomTableVue>
  </div>
</template>

<script lang="ts" setup>
import CustomTableVue from "@/components/common/table/CustomTable.vue";
import { useFunc } from "@/hook/useFunc";
import { useOptions } from "@/hook/useOptions";
const fieldList: any = [
  { name: "id", label: "事件编号", type: "TOOLTIP", width: 110},
  { name: "fswz", label: "事发地址", type: "TOOLTIP" },
  { name: "fssj", label: "事发时间", type: "TOOLTIP" },
  { name: "czzt", label: "事件状态", type: "SLOT", width: 110 },//未对齐
  { name: "sjlb", label: "事件类别", type: "TOOLTIP", width: 110 },
  { name: "jjcd", label: "事件等级", type: "TEXT", width: 110 },//未对齐
  { name: "fssj", label: "上报时间", type: 'TOOLTIP' },//未对齐
  { name: "action", label: "操作", type: "SLOT", width: 80 },
];

const tableData = ref([]);
const props = defineProps({
  year: {
    default: 2024,
  },
  month: {
    default: 1,
  },
});
const textColorClass = (status: string) => {
  // switch(status) {
  //   case '低级': return 'blue-text';
  //   case '中级': return 'orange-text';
  //   case '高级': return 'red-text';
  //   default: return '';
  // }
  if(status){
    return 'blue-text'
  }else{
    return 'red-text'
  
  }
}


const sblist=ref([])

onMounted(()=>{
  useFunc().getGLData('/emergency/command/getEmergencyYjsjDetailData').then((res:any)=>{
     tableData.value=res.data.data
     console.log(tableData.value,'yagj');
  })
  useFunc().getGLData('/device/queryDeviceList').then((res:any)=>{
    sblist.value=res.data.data
     console.log(sblist.value,'fhbgjkd');
  })
})
</script>
<style scoped> 
.white-text {
  color:#E6FDFF 80%
}
.blue-text {
  color: #5CE1FF;
}
.red-text {
  color: red;
}

.orange-text {
  color: orange;
}
</style>
